
/*
 * General styles
 */

* {
	margin:0;
	padding:0;
}

html, body {
	width:100%;
	height:100%;
}

body {
	font-family:'Gloria Hallelujah', cursive;
	background:#000 url(images/background-high.jpg) no-repeat 50% 50%;
	background-size:cover;
	background-attachment:fixed;
}

/*
 * Wrapper styles
 */

#wrapper {
	min-height:100%;
	margin-bottom:-330px;
	position:relative;
}

#wrapper #wrapperclear {
	height:330px;
	clear:both;
}

/*
 * Header styles
 */

#header {
	background:transparent url(images/header-high.png) no-repeat 50% 50%;
	width:1040px;
	height:140px;
	margin:0 auto;
	position:relative;
	z-index:100;
}

#header #free2play {
	width:161px;
	height:90px;
	position:absolute;
	top:5px;
	right:69px;
	font-size:1.5em;
	line-height:1.5em;
	text-align:center;
}

#header #free2play a {
	color:#e34343;
	text-decoration:none;
}

#header #account {
	position:absolute;
	top:5px;
	right:250px;
	font-size:1.2em;
	line-height:1.5em;
	text-align:right;
}

#header #account #accountUsername {
	display:inline-block;
}

#header #account #accountUsername a {
	color:#03c;
	text-decoration:none;
}

/*
 * Content styles
 */

#content1col, #content2col {
	width:940px;
	margin:-74px auto 0 auto;
	position:relative;
}

#content1col, #content2col #content2col1 {
	background:transparent url(images/paper-all-med.jpg) no-repeat 50% 100%;
	padding:40px 0;
	position:relative;
	z-index:50;
}

#content1col, #content2col #content2col1, #content2col #content2col2 {
	box-shadow:0 0 30px 0 #000;
}

#content2col #content2col1 {
	background-size:cover;
	width:640px;
}

#content2col #content2col2 {
	width:300px;
	background-color:#031838;
	border:4px solid #042b4c;
	position:absolute;
	top:70px;
	left:636px;
	z-index:0;
}

#content2col #content2col1 h1,
#content2col #content2col1 h2,
#content2col #content2col1 h3,
#content2col #content2col1 h4,
#content2col #content2col1 h5,
#content2col #content2col1 h6,
#content2col #content2col1 p {
	margin:0 20px;
	text-shadow:1px 1px 2px rgba(0, 0, 0, 0.5);
}

#content2col #content2col1 h1 {
	font-size:1.5em;
	line-height:1.5em;
	text-transform:capitalize;
	display:inline-block;
	padding:0 10px;
	margin:20px 10px 0 10px;
	border-bottom:7px solid #000;
}

#content2col #content2col1 h1.hasimage {
	display:block;
}

#content2col #content2col1 h1 span {
	display:inline-block;
	background-color:#000;
	color:#fff;
	padding:0 10px;
}

#content2col #content2col1 section:first-child h1 {
	margin-top:0;
}

#content2col #content2col1 img {
	width:571px;
	border:7px solid #000;
	margin:-7px 0 -20px 28px;
}

#content2col #content2col1 p {
	font-size:1.2em;
	font-variant:small-caps;
	line-height:1.4em;
	margin-top:20px;
	margin-left:35px;
}

#content2col #content2col1 a {
	color:#03c;
	text-decoration:none;
}

/*
 * Right hand menu for 2 column layout
 */

#content2col #content2col2 #content2col2menu {
	
}

#content2col #content2col2 #content2col2menu .content2col2menuitem {
	font-size:1.5em;
	line-height:1.5em;
	display:block;
	background: url(images/menu-item-triangle-light.png) no-repeat 100% 50%;
}

#content2col #content2col2 #content2col2menu .content2col2menuitem:nth-child(odd) {
	background-color:#051f46;
}

#content2col #content2col2 #content2col2menu .content2col2menuitem:hover,
#content2col #content2col2 #content2col2menu .content2col2menuitem.content2col2menuitemactive {
	background-color:#143b5c;
}

#content2col #content2col2 #content2col2menu .content2col2menuitem a {
	display:block;
	color:#fff;
	text-decoration:none;
	padding:10px 10px 10px 20px;
	
	-webkit-transition:all 250ms ease-out;
	-moz-transition:all 250ms ease-out;
	-ms-transition:all 250ms ease-out;
	-o-transition:all 250ms ease-out;
	transition:all 250ms ease-out;
}

#content2col #content2col2 #content2col2menu .content2col2menuitem a:hover,
#content2col #content2col2 #content2col2menu .content2col2menuitem.content2col2menuitemactive a {
	padding:10px 10px 10px 30px;
}

/*
 * Form styles
 */

#content2col #content2col1 form {
	margin:15px 35px 0 35px;
}

#content2col #content2col1 form label {
	display:block;
	font-variant:small-caps;
}

#content2col #content2col1 form .input {
	position:relative;
}

#content2col #content2col1 form .input .inputicon {
	display:none;
}

#content2col #content2col1 form .input.error .inputicon {
	width:528px;
	padding:10px 17px;
	border-right:7px solid #000;
	border-bottom:7px solid #000;
	color:#c30;
	background:#000 url(images/icons/48x48/cancel.png) no-repeat 100% 50%;
	display:block;
}

#content2col #content2col1 form .input.valid .inputicon {
	position:absolute;
	right:0;
	top:0;
	width:48px;
	height:100%;
	padding:0 10px;
	background:#000 url(images/icons/48x48/accept.png) no-repeat 50% 50%;
	display:block;
}

#content2col #content2col1 form input,
#content2col #content2col1 form select {
	display:block;
	font-family:'Gloria Hallelujah', cursive;
	font-size:1.5em;
	font-variant:small-caps;
	color:#fff;
	background:#111;
	border:7px solid #000;
	width:535px;
	padding:5px 10px;
	box-shadow:0 0 20px #000;
	outline:none;
}

#content2col #content2col1 form .select {
	width:568px;
	box-shadow:0 0 20px #000;
}

#content2col #content2col1 form select {
	width:568px;
}

#content2col #content2col1 form input[type="submit"] {
	display:inline-block;
	width:auto;
	background-color:#c30;
	padding:5px 20px;
	margin-top:20px;
}

#content2col #content2col1 form img {
	width:554px;
	margin:0;
	border-top:0 none;
}

/*
 * Footer styles
 */

#footerwrapper {
	height:330px;
	position:relative;
	width:100%;
}

#footer {
	position:absolute;
	background:#000 url(images/footer.png) repeat 0 0;
	border-top: 7px solid #000;
	bottom:0;
	width:100%;
	box-shadow:inset 0 20px 20px -20px;
}

#footer #footercontent {
	font-family:arial, sans-serif;
	font-size:0.8em;
	color:#fff;
	width:940px;
	margin:0 auto;
	padding:20px;
}

#footer #footercontent p,
#footer #footercontent td {
	padding:10px 20px;
}

#footer #footercontent #disclaimer {
	width:640px;
}

#footer #footercontent #navigation {
	float:right;
	text-align:right;
}

#footer #footercontent #navigation a {
	display:block;
	color:#fff;
}

/*
 * Game page styles
 */

#__game {
	width:900px;
	height:540px;
	background:#000;
	border:7px solid #000;
	margin:40px auto;
}

#__game #__splash {
	width:100%;
	text-align:center;
	margin-top:240px;
	color:#fff;
}